import React from 'react';
import ReactDom from 'react-dom';


/*
* 针对hooks是不是让函数组件有了实例这个问题的解答？
* useState:{useState}
* 1.类可以 new 实例，且不能轻易销毁，也难以销毁，而且类上的属性很多，管理起来也会很麻烦，性能有问题
* 2--->因此可以多使用函数组件，少用类组件，但是函数没有状态，也没有生命周期
* 3--->useState主要是在函数里面可以使用状态，例如下面的计数器
*
*/


//简单实现useState

let count;

function useState(initialState) {
    count = initialState;

    function setCount(newCount) {
        count = newCount;

    }

    return [count, setCount]
}


function Counter(props) {

    let [count, setCount] = useState(0)
    return (
        <div>
            <span>{count}</span>
            <p onClick={() => setCount(count + 1)}>+</p>
        </div>
    )
}

ReactDom.render(<Counter/>, document.getElementById('root'));
